<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="../common/jspcommon.jsp"%>

<script type="text/javascript">
	
	$(function(){
		//初始化入学年份
		$("select[name='entryDate']").each(function(){
			var date = new Date();
			var currentYear = date.getFullYear();
			var yearOption="";
			for ( var i = currentYear; i > currentYear-60; i--) {
				yearOption += "<option value=" + i + "> " + i
						+ "</option>";
			}
			$(yearOption).appendTo($(this));
			var date = new Date($(this).attr("myDate"));
			$(this).val(date.format("yyyy"));
		});
		$.metadata.setType("attr","validate");
		$("#base_info_form").validate();
	});
	
	function goonLearning(){
		$("#tianJiaSchool").show();
		$("#addLearning").find("#schoolType").val("");
		$("#addLearning").find("#school").val("");
		$("#addLearning").find("#className").val("");
		$("#addLearning").find("#year").val('');
		$("#addLearning").find("#college").val("");
		$("#addLearning").find("#learningId").val("");
	}
	
	function fqLearning(){
		$("#tianJiaSchool").hide();
	}
	function changeSchool(){
		var schoolTypeLabel = $("#addLearning").find("#schoolType").val();
		if(schoolTypeLabel=="01"){
			$("#yuanXi").show();
		}else{
			$("#yuanXi").hide();
		}
	}
	function editSchool(id){
		$("#tianJiaSchool").show();
		$("#addLearning").find("#schoolType").val($("#"+id+"").find("#schoolTypeValue").val());
		changeSchool(self);
		$("#addLearning").find("#school").val($("#"+id+"").find("#school").html());
		$("#addLearning").find("#className").val($("#"+id+"").find("#className").html());
		$("#addLearning").find("#year").val($("#"+id+"").find("#entryDate").html());
		$("#addLearning").find("#college").val($("#"+id+"").find("#college").html());
		$("#addLearning").find("#learningId").val($("#"+id+"").find("#learningId").val());
	}
	
	function deleteSchool(id){
		$("#member_info_detail").load("deleteLearningItem.htm?memberId="+$("#memberId").html()+"&id="+id,function(){
				$("#member_info_detail").load("memberExper.htm?memberId="+$("#memberId").html(),
						function() {
							showSuccess();
						});
				$("#gxzl4").attr("class", "current");
		});
	}
	
	function clearSchool(){
		$("#errorSchoolType").html("");
		$("#errorSchool").html("");
		$("#errorCollege").html("");
		$("#errorClassName").html("");
		$("#errorYear").html("");
	}
	
	function saveSchool(){
		var schoolType=$("#addLearning").find("#schoolType").val();
		var school=$("#addLearning").find("#school").val(); 
		var college=$("#addLearning").find("#college").val(); 
		var className=$("#addLearning").find("#className").val(); 
		var entryDate=$("#addLearning").find("#year").val();
		if(schoolType=="00" || schoolType==null){
			clearSchool();
			$("#errorSchoolType").html("请选择学校类型");
			return;
		}else if(school=="" || school==null){
			clearSchool();
			$("#errorSchool").html("学校名称不能为空");
			return;
		}else if(school.length>30){
			clearSchool();
			$("#errorSchool").html("长度不能超过30个字符");
			return;
		}else if(schoolType=='01' && college==""){
			clearSchool();
			$("#errorCollege").html("院系名称不能为空");
			return;
		}else if(schoolType=='01' && college.length>30){
			$("#errorCollege").html("长度不能超过30个字符");
			return;
		}else if(className==""){
			clearSchool();
			$("#errorClassName").html("班级名称不能为空");
			return;
		}else if(className.length>30){
			clearSchool();
			$("#errorClassName").html("长度不能超过30个字符");
			return;
		}else if(entryDate=='' || entryDate==null){
			clearSchool();
			$("#errorYear").html("请选择入学年份");
			return;
		}
		var id = $("#addLearning").find("#learningId").val();
		$("#saveLearningButton").attr("onclick","");
		$.post("saveLearningItem.htm?memberId="+$("#memberId").html(),{
			id:id,
			schoolType:schoolType,
			school:school,
			college:college,
			className:className,
			entryDate:entryDate}
		,function(data){
			if(data=='success'){
				$("#member_info_detail").load("memberExper.htm?memberId="+$("#memberId").html(),
						function() {
							showSuccess();
						});
				$("#gxzl4").attr("class", "current");
			}
		})
	}
	
	function goonWork(){
		$("#tianJiaWork").show();
		$("#startDate").find("#year").val("");
		$("#startDate").find("#month").val('');
		$("#endDate").find("#year").val("");
		$("#endDate").find("#month").val("");
		$("#addWork").find("#unit").val('');
		$("#addWork").find("#department").val('');
		$("#toNow").attr("checked",false);
		$("#addWork").find("#workId").val("");
		$("#endDate").show();
	}
	
	function fqWork(){
		$("#tianJiaWork").hide();
	}
	
	function editWork(id){
		$("#tianJiaWork").show();
		$("#startDate").find("#year").val($("#"+id+"").find("#entryYear").val());
		$("#startDate").find("#month").val($("#"+id+"").find("#entryMonth").val());
		if($("#"+id+"").find("#departureYear").val()==''){
			$("#endDate").find("#year").val("");
			$("#endDate").find("#month").val("");
			$("#toNow").attr("checked",true);
		}else{
			$("#toNow").attr("checked",false);
			$("#endDate").find("#year").val($("#"+id+"").find("#departureYear").val());
			$("#endDate").find("#month").val($("#"+id+"").find("#departureMonth").val());
		}
		clickToNow();
		$("#addWork").find("#workId").val($("#"+id+"").find("#workId").val());
		$("#addWork").find("#unit").val($("#"+id+"").find("#unit").html());
		$("#addWork").find("#department").val($("#"+id+"").find("#department").html());
	}
	
	function deleteWork(id){
		$("#member_info_detail").load("deleteWorkItem.htm?memberId="+$("#memberId").html()+"&id="+id,function(){
			$("#member_info_detail").load("memberExper.htm?memberId="+$("#memberId").html(),
					function() {
						showSuccess();
					});
			$("#gxzl4").attr("class", "current");
		});
	}
	
	function saveWork(){
		if($("#addWork").find("#unit").val()==""){
			$("#errorUnit").html("公司名称不能为空");
			return;
		}else if($("#addWork").find("#unit").val().length>30){
			$("#errorUnit").html("不能超过30个字符");
			return;
		}else if($("#addWork").find("#department").val()==""){
			$("#errorUnit").html("");
			$("#errorDepartment").html("部门职位不能为空");
			return;
		}else if($("#addWork").find("#department").val().length>30){
			$("#errorDepartment").html("不能超过30个字符");
			return;
		}else if($("#startDate").find("#year").val()=='' || $("#startDate").find("#month").val()==''){
			$("#errorUnit").html("");
			$("#errorDepartment").html("");
			$("#errorDate").html("时间没有选择完整");
			return;
		}else if(!$("#toNow").attr("checked") && ($("#endDate").find("#year").val()=='' || $("#endDate").find("#month").val()=='')){
			$("#errorUnit").html("");
			$("#errorDepartment").html("");
			$("#errorDate").html("时间没有选择完整");
			return;
		}
		var workId = $("#addWork").find("#workId").val(); 
		var unit=$("#addWork").find("#unit").val();
		var department=$("#addWork").find("#department").val(); 
		var startYear=$("#startDate").find("#year").val(); 
		var startMonth=$("#startDate").find("#month").val(); 
		var startDay="01"; 
		var entryDate = startYear+"-"+startMonth+"-"+startDay;
		var departureDate = "";
		if(!$("#toNow").attr("checked")){
			endYear=$("#endDate").find("#year").val(); 
			endMonth=$("#endDate").find("#month").val(); 
			endDay='01'; 
			departureDate = endYear+"-"+endMonth+"-"+endDay;
		}
		//如果起始时间大于截止时间则提交
		if(departureDate!="" && (startYear>endYear || (startYear==endYear && startMonth>endMonth))){
			$("#errorDate").html("起始时间不能早于截止时间");
		}else{
			$("#saveWorkButton").attr("onclick","");
			$.post("saveWorkItem.htm?memberId="+$("#memberId").html(),{
				id:workId,
				unit:unit,
				department:department,
				entryDate:entryDate,
				departureDate:departureDate}
			,function(data){
				if(data=='success'){
					$("#member_info_detail").load("memberExper.htm?memberId="+$("#memberId").html(),
							function() {
								showSuccess();
							});
					$("#gxzl4").attr("class", "current");
				}
			});
		}
	}
	
	function clickToNow(){
		if($("#toNow").attr("checked")=='checked'){
			$("#endDate").hide();
		}else{
			$("#endDate").show();
		}
	}
	
</script>
<style type="text/css">
	.error{
		color: red;
	}
</style>

<div class="success" id="base_info_tip_success" style="display: none; margin-left: 32px;">
		<img alt="修改成功" src="<%=basePath%>images/home_images/ico29.png">个人经历修改成功
	</div>
	<div class="h_work">
                    	<div class="browse_work" id="learningExp">
                    		<h3>你的教育情况一览</h3>
                            <div>
                            	<table width="692">
                                  <tr>
                                    <th width="100" align="center">学校类型</th>
                                    <th width="200" align="center">学校名称</th>
									 <th width="150" align="center">院系</th>
                                    <th width="100" align="center">班级</th>
                                    <th width="100" align="center">入学年份</th>
                                    <th width="100" align="center">谁可以看见</th>
                                    <th width="100" align="center">操作</th>
                                  </tr>
                                  <c:forEach items="${learningList}" var="learning" varStatus="v">
                                  <tr id="learning${v.index }">
                                    <td>
                                    <input type="hidden" id="schoolTypeValue" value="${learning.schoolType}"/>
                                    <c:out value="${learning.schoolTypeName}" />
                                    </td>
                                    <td id="school"><c:out value="${learning.school}" /></td>
									<td id="college"><c:if test="${learning.schoolTypeLabel=='大学'}"><c:out value="${learning.college}" /></c:if><c:if test="${learning.schoolTypeLabel!='大学'}">无</c:if></td>
                                    <td id="className"><c:out value="${learning.className}" /></td>
                                    <td id="entryDate"><c:out value="${learning.entryDate}" /></td>
                                    <td><select><option id="visible">仅好友</option></select></td>
                                    <td>
                                     <input type="hidden" id="learningId" value="${learning.id }">
                                    <a href="javascript:void(0);" onclick="javascript:editSchool('learning${v.index }');">修改</a>
                                    <a href="javascript:void(0);" onclick="javascript:deleteSchool('${learning.id}');">删除</a>
                                    </td>
                                  </tr>
                                  </c:forEach>
                                </table>
                                 <div id="tianJiaSchool" style="display:none">
                        	<h3>添加教育经历</h3>
                            <div>
                            <table id="addLearning">
                              <tr>
                                <td width="87" class="data_text">
                                <input type="hidden" id="learningId" value="">
                                学校类型：</td>
                                <td width="593">
                             	   <select name="schoolType" id="schoolType" onchange="changeSchool()">
										<option value="00">请选择</option>
										<c:forEach items="${schoolType}" var="school">
											<option value="${school.value}">${school.label}</option>
										</c:forEach>
									</select>
									<div id="errorSchoolType" style="display: inline;" class="error"></div>
                                </td>
                              </tr>
                              <tr>
                                <td class="data_text">学校名称：</td>
                                <td><input type="text" id="school" />
                                <div id="errorSchool" style="display: inline;" class="error"></div>
                                </td>
                              </tr>
                              <tr style="display: none;" id="yuanXi">
                                <td class="data_text">院系：</td>
                                <td><input type="text" id="college"/>
                                 <div id="errorCollege" style="display: inline;" class="error"></div>
                                </td>
                              </tr>
                              <tr>
                                <td class="data_text">班级：</td>
                                <td><input type="text" id="className"/>
                                <div id="errorClassName" style="display: inline;" class="error"></div>
                                </td>
                              </tr>
                              <tr>
                                <td class="data_text">入学年份：</td>
                                <td id="entryYear">
                                   <select id="year" ></select>年
                                   <script type="text/javascript">
										yearMonthDay($("#entryYear"));
									</script>
									 <div id="errorYear" style="display: inline;" class="error"></div>
                                </td>
                              </tr>
                              <tr>
                                <td class="data_text">谁可看见：</td>
                                <td>
                                   <select><option>仅好友</option></select>
                                </td>
                              </tr>
                            </table>
                             <table>
			                  <tr>
			                    <td width="80"></td>
			                    <td width="524">
			                    <div class="h_button w75 mt15"><strong onclick="saveSchool()" id="saveLearningButton">保存设置</strong></div>  
			                    </td>
			                  </tr>
			                </table>
                            </div>
                        </div>
                                <table id="beforeLearning"><tr><td align="right"><a href="javascript:void(0);" onclick="goonLearning()">【添加】</a></td></tr></table>
                          </div>
                        </div>
                       	<div class="browse_work" id="learningExp">
                    		<h3>你的工作情况一览</h3>
                            <div>
                            	<table width="692">
                                  <tr>
                                    <th width="200" align="center">单位名称</th>
                                    <th width="100" align="center">部门</th>
                                    <th width="200" align="center">在职时间</th>
                                     <th width="100" align="center">谁可以看见</th>
                                    <th width="100" align="center">操作</th>
                                  </tr>
                                  <c:forEach items="${workList}" var="work" varStatus="v">
                                  <tr id="work${v.index }">
                                    <td id="unit"><c:out value="${work.unit}" /></td>
                                    <td id="department"><c:out value="${work.department}" /></td>
                                    <td>
                                    从${work.entryYear }-${work.entryMonth }
									<c:choose>
										<c:when test="${work.departureDate==null||work.departureDate==''}">
											至今
										</c:when>
										<c:otherwise>
											到${work.departureYear }-${work.departureMonth }
										</c:otherwise>
									</c:choose>
                                    </td>
                                    <td><select><option>仅好友</option></select></td>
                                    <td>
                                    	<input type="hidden" id="entryYear" value="${work.entryYear }">
                                    	<input type="hidden" id="entryMonth" value="${work.entryMonth }">
                                    	<input type="hidden" id="departureYear" value="${work.departureYear }">
                                    	<input type="hidden" id="departureMonth" value="${work.departureMonth }">
                                    	<input type="hidden" id="workId" value="${work.id }">
	                                     <a href="javascript:void(0);" onclick="javascript:editWork('work${v.index }');">修改</a>
	                                     <a href="javascript:void(0);" onclick="javascript:deleteWork('${work.id}');">删除</a>
                                    </td>
                                  </tr>
                                  </c:forEach>
                                </table>
                                 <div id="tianJiaWork" style="display: none" class="add_work mt30">
                        	<h3>添加工作经历</h3>
                            <div>
                            <table id="addWork">
                              <tr>
                                <td width="87" class="data_text">
                                <input type="hidden" id="workId">
                                公司名称：</td>
                                <td width="575"><input type="text" id="unit"/>
                                <div id="errorUnit" style="display: inline;" class="error"></div>
                              </tr>
                              <tr>
                                <td class="data_text">部门职位：</td>
                                <td><input type="text" id="department"/><div id="errorDepartment"  style="display: inline;" class="error"></div></td>
                              </tr>
                              <tr>
                                <td class="data_text">在职时间：</td>
                                <td>
                                <span id="startDate"><select id="year" ></select>年<select id="month"></select>月</span>&nbsp;&nbsp;
                                至<span id="endDate"><select id="year" ></select>年<select id="month"></select>月</span>
                                （<input name="checkbox" type="checkbox" onclick="clickToNow()" id="toNow" />至今）
                                <div id="errorDate"  class="error"></div>
                                </td>
                                 <tr>
                                <td class="data_text">谁可看见：</td>
                                <td>
                                   <select><option>仅好友</option></select>
                                </td>
                              </tr>
                            </table>
                            <table>
			                  <tr>
			                    <td width="80"></td>
			                    <td width="524">
			                    	<div class="h_button w75 mt15"><strong onclick="saveWork()" id="saveWorkButton">保存设置</strong></div>
			                    </td>
			                  </tr>
			                </table>
                            <script type="text/javascript">
							yearMonthDay($("#startDate"));
							yearMonthDay($("#endDate"));
						</script>
                            </div>
                        </div>
                    </div>
                  <table id="beforeWork"><tr><td align="right"><a href="javascript:void(0);" onclick="goonWork()">【添加】</a></td></tr></table>	
                          </div>
                        </div>
